<!--
 * @Author: xuxu12138 1718324422@qq.com
 * @Date: 2023-10-19 09:19:16
 * @LastEditors: xuxu12138 1718324422@qq.com
 * @LastEditTime: 2023-11-24 14:13:55
 * @FilePath: /things-admin/src/view/device/Edit/maintenance/Addtenance.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="core" style="margin-top: 100px">
    <Form
      ref="formValidate"
      :model="model"
      :rules="ruleValidate"
      :label-width="100"
    >

      <FormItem label="部件名称：" prop="modeName" required>
        <Input v-model="model.modeName" style="width: 400px" />
      </FormItem>
      <FormItem label="标识符：" prop="code" required>
        <Input v-model="model.code" style="width: 400px" />
      </FormItem>
      <FormItem label="部件描述：" prop="desc" required>
        <Input v-model="model.desc" type="textarea" style="width: 400px" />
      </FormItem>
      <FormItem label="部件使用时长上限：" prop="maximumDuration" required>
        <Input v-model="model.maximumDuration" style="width: 400px" />
      </FormItem>
      <FormItem label="质保时间：" prop="qualityTime" required>
        <Input v-model="model.qualityTime" style="width: 400px" />
      </FormItem>
    </Form>
    <div>
      <Button style="width: 100px; height: 40px" @click="handleCancel()"
        >返回</Button
      >
      <Button
        style="margin-left: 30px; width: 100px; height: 40px"
        type="primary"
        @click="handleSubmit1('formValidate')"
        >保存
      </Button>
    </div>
  </div>
</template>

<script>
import { postMaintenanceModel } from "@/base/api/MaintenanceModelApi";
export default {
  data() {
    return {
      model: {
        modeName: "",
        desc: "",
        maximumDuration: '',
        qualityTime: '',
        code:''
      },
      ruleValidate: {
        code: [
          { required: true, message: "code不能为空", trigger: "blur" },
        ],
        modeName: [
          { required: true, message: "模式名不能为空", trigger: "blur" },
        ],
        desc: [{ required: true, message: "描述不能为空", trigger: "blur" }],
        maximumDuration: [
          {
            required: true,
            message: "部件使用时长上限不能为空",
            trigger: "blur",
          },
        ],
        qualityTime: [
          {
            required: true,
            message: "质保时间不能为空",
            trigger: "blur",
          },
        ],
      },
    };
  },
  props: ["id"],
  methods: {
    //返回
    handleCancel() {
      this.$emit("selectChange", 1, 0);
    },
    //保存
    handleSubmit1(data) {
      this.$refs[data].validate((valid) => {
        if (valid) {
          // console.log("ppppp");
          postMaintenanceModel({
            code: this.model.code,
            modelId: Number(this.id),
            descriptions: this.model.desc,
            componentName: this.model.modeName,
            usageTime: this.model.maximumDuration,
            warranty: this.model.qualityTime,
          })
            .then((res) => {
              this.$emit("selectChange", 1, 1);
            })
            .finally(() => {});
        } else {
          console.log(11);
        }
      });
    },
  },
};
</script>

<style lang="less" scoped>
.core {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
</style>
